import { useEffect, useRef } from 'react';

function useInfiniteScroll(loadNextPage) {
  const containerRef = useRef(null);
  useEffect(() => {
    function handleScroll() {
      const container = containerRef.current;
      if (container.scrollTop + container.clientHeight >= container.scrollHeight) {
        // 滚动到底部，执行加载分页数据的操作
        loadNextPage();
      }
    }

    const container = containerRef.current;
    container.addEventListener('scroll', handleScroll);

    return () => {
      container.removeEventListener('scroll', handleScroll);
    };
  }, [loadNextPage]);

  return containerRef;
}

export default useInfiniteScroll;
